<!-- 校区资产在线率top10 -->
<template> 
    <el-card class="box-card" shadow='never' style="height:356px;border-radius:6px">
        <div slot="header" class="clearfix">
            <span class="title" style="color:#459ffc;font-size:16px;"> {{ title }}</span>
        </div>
        <div class="content" style="height:360px">
        <tendency-chart style="height:320px;"  v-if="DataEventTrendList.Detail &&( DataEventTrendList.Detail!=null|| DataEventTrendList.Detail!=undefined )|| DataEventTrendList.length != 0"  :chartData='DataEventTrendList'></tendency-chart>
        <div class="empty">
            <svg-icon icon-class="notAvailable" class="notAvailable"></svg-icon>
        </div> 
        </div>  
    </el-card>
</template>

<script>
import tendencyChart from './BarChart2'
import { connrequest } from '@/api/firstPage';
export default {
    components: {
        tendencyChart,
    },
    data() {
        return {
            timer: null,
            DataEventTrendList:[],
        };
    },
    props: {
        title: {
            type: String,
            default: '事件趋势（最近一周）'
        },
        CmdCode: {
            type: String,
            default: 'DataEventTrend'
        },
        DataList:{
            type: Object,
            default: () => {}
        }
        
    },
    watch: {
    },
//生命周期 - 创建完成（访问当前this实例）
created() {},
//生命周期 - 挂载完成（访问DOM元素）
mounted() {
    this.$nextTick(() => {
        // this.GetDictElem()
        this.DataEventTrendList = this.DataList
    })
},
methods: {
    async GetDictElem(){
        const data = {
            Filter: {
                Value: 'DeviceType'
            }
        }
        const res = await connrequest('GetDictElem', data)
        let series = []
        res.Data.Input.Option.map(item => {
            if(item)
            series.push({
                name: item.Name, 
                type: 'bar', 
                stack: 'DeviceType', 
                data: this.DataList.counts[item.Classify1ID],
                barWidth : 50,
                itemStyle: {
                    normal: {
                        label: {
                            textStyle: { //数值样式
                                fontSize: 16
                            }
                        }
                    }
                },
            })
        })
        this.DataEventTrendList = {
            series: series.filter(item => item.data !== undefined),
            xAxis: this.DataList.xAxisData
        }
    }
},
beforeDestroy(){
    // this.$once('hook:beforeDestroy',() =>{
    //     clearInterval(this.timer)
    // })
},
};
</script>
<style lang="scss" scoped>


</style>